import {ApplicationConfigurationProvider, darken, lighter, PageThemeUtils} from "plain-design";

export function useEchartsColor() {

  const configuration = ApplicationConfigurationProvider.inject();
  let primaryColor = configuration.value.theme.vars["primary-6"];
  const colors = PageThemeUtils.state.primaryKey === 'dark' ? {
    color1: primaryColor,
    color2: primaryColor,
    color3: primaryColor,
    color4: primaryColor,
    color5: primaryColor,
    color6: primaryColor,
  } : (() => {
    let processor = primaryColor.toLowerCase() == '#ffffff' ? darken : lighter;
    return {
      color1: processor(primaryColor, 1),
      color2: processor(primaryColor, 2),
      color3: processor(primaryColor, 3),
      color4: processor(primaryColor, 4),
      color5: processor(primaryColor, 5),
      color6: processor(primaryColor, 6),
    };
  })();

  return {
    text1: configuration.value.theme.vars["text-1"],
    text2: configuration.value.theme.vars["text-2"],
    text3: configuration.value.theme.vars["text-3"],
    text4: configuration.value.theme.vars["text-4"],
    bg1: configuration.value.theme.vars["bg-1"],
    bg2: configuration.value.theme.vars["bg-2"],
    bg3: configuration.value.theme.vars["bg-3"],
    bg4: configuration.value.theme.vars["bg-4"],
    ...colors,
  };
}
